import { Alert, Button, StyleSheet, View } from "react-native";
import React, { useState } from "react";
import AvatarImage from "@/components/common/Avatar/AvatarImage";
import { AntDesign } from "@expo/vector-icons";
import CustomInput from "@/components/common/Input/CustomInput";
import {
  aiImgRespo,
  aiRespo,
  hotReloadRespo,
  resetRespo,
} from "@/services/api/ai-code";

export default function StandardHomeSearch() {
  // 使用 useState 来管理输入框的文本内容
  const [inputValue, setInputValue] = useState("");

  const resetDom = async () => {
    Alert.alert("已经开始重制");
    await resetRespo();
    Alert.alert("重制完成");
  };

  const hotReload = async () => {
    Alert.alert("已经开始热更新");
    await hotReloadRespo();
    Alert.alert("构建完成");
  };

  const handleSubmit = async () => {
    Alert.alert("已经开始远程构建");
    await aiRespo(inputValue);
    Alert.alert("构建完成");
  };

  const handleSubmitImg = async () => {
    Alert.alert("已经开始远程构建");
    await aiImgRespo();
    Alert.alert("构建完成");
  };

  return (
    <View style={styles.container}>
      <Button title={"图片"} onPress={handleSubmitImg} />
      {/*<AvatarImage*/}
      {/*  size={36}*/}
      {/*  image={require("../../assets/images/chameleon.jpg")}*/}
      {/*></AvatarImage>*/}
      {/* 禁用的输入框 */}
      <CustomInput
        icon={<AntDesign name="search1" size={24} color="#888" />}
        placeholder="请输入内容"
        value={inputValue} // 将输入框的值绑定到 state 变量
        onChangeText={setInputValue} // 当文本变化时更新 state 变量
        editable={true} // 确保输入框可编辑
      />
      <Button title={"提交"} onPress={handleSubmit} />
      <Button title={"热更新"} onPress={hotReload} />
      <Button title={"重置"} onPress={resetDom} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flexDirection: "row",
    alignItems: "center",
    height: 40,
  },
});
